﻿@using ZDSoft.LMS.Web.Controllers
@model ZDSoft.LMS.Domain.TransportOrder
@{
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<!DOCTYPE html>
<html>
<head>
    <title>Create</title>
    <script src="../../Scripts/jquery-1.5.1.min.js" type="text/javascript"></script>
    @*引用Jquery验证功能的脚本*@
    <script src="../../Scripts/Validation/formValidator-4.0.1.js" type="text/javascript"></script>
    <script src="../../Scripts/Validation/formValidatorRegex.js" type="text/javascript"></script>
    <link type="text/css" rel="stylesheet" href="../../Scripts/Validation/validatorTidyMode.css" />
    @*引用Jquery验证功能的脚本*@ @*引用autocomplete的脚本库*@
    <script type='text/javascript' src='../../Scripts/AutoComplete/jquery.bgiframe.min.js'></script>
    <script type='text/javascript' src='../../Scripts/AutoComplete/jquery.ajaxQueue.js'></script>
    <script type='text/javascript' src='../../Scripts/AutoComplete/thickbox-compressed.js'></script>
    <script type='text/javascript' src='../../Scripts/AutoComplete/jquery.autocomplete.js'></script>
    <script type='text/javascript' src='../../Scripts/AutoComplete/localdata.js'></script>
    <link rel="stylesheet" type="text/css" href="../../Scripts/AutoComplete/main.css" />
    <link rel="stylesheet" type="text/css" href="../../Scripts/AutoComplete/jquery.autocomplete.css" />
    <link rel="stylesheet" type="text/css" href="../../Scripts/AutoComplete/thickbox.css" />
    @*引用autocomplete的脚本库*@
    <style type="text/css">
        .formatedtable
        {
            width: 100%;
            border: 1px solid #007ea2;
            background-color: #DFF2FF;
            border-collapse: collapse;
        }
        .formatedtable td
        {
            padding: 2px;
        }
        .btn3
        {
            background-image: url(../../Content/Images/but3.gif);
            width: 62px;
            height: 21px;
            border: 0px;
            color: #4565B1;
            text-align: left;
            padding-top: 3px;
            padding-left: 17px;
            cursor: pointer;
        }
        .needID
        {
            border: 1px solid red;
        }
    </style>
    <script type="text/javascript">
        $(document).ready(function () {
            //代码块1，发站
            $("#StartStation_Name").autocomplete("/TransportOrder/FindStation", {
                width: 260,
                selectFirst: true,
                extraParams: { provinceID: function () { return $("#ddlStartSatationProvince").val(); } },
                formatItem: function (data, i, total) {
                    var arr = String(data).split(",");
                    return "<I>" + arr[0] + "</I>";
                },
                formatMatch: function (data, i, total) {
                    return data[0];
                },
                formatResult: function (data) {
                    var arr = String(data).split(",");
                    return arr[0];
                }
            }).result(function (event, data, formatted) {
                var arr = String(data).split(",");
                $("#txtStartSatationNameID").val(arr[1]);
                $("#ddlDestionationProvince").focus();
            });

            //代码块2,到站
            $("#DestionationStation_Name").autocomplete("/TransportOrder/FindStation", {
                width: 260,
                selectFirst: true,
                extraParams: { provinceID: function () { return $("#ddlDestionationProvince").val(); } },
                formatItem: function (data, i, total) {
                    var arr = String(data).split(",");
                    return "<I>" + arr[0] + "</I>";
                },
                formatMatch: function (data, i, total) {
                    return data[0];
                },
                formatResult: function (data) {
                    var arr = String(data).split(",");
                    return arr[0];
                }
            }).result(function (event, data, formatted) {
                var arr = String(data).split(",");
                $("#txtDestionationNameID").val(arr[1]);
                $("#StartStationLocation").focus();
            });
            //发货地址
            $("#StartStationLocation").autocomplete("/TransportOrder/FindAddress", {
                width: 260,
                selectFirst: true,
                formatItem: function (data, i, total) {
                    return "<I>" + data[0] + "</I>";
                },
                formatMatch: function (data, i, total) {
                    return data[0];
                },
                formatResult: function (data) {
                    return data[0]
                }
            }).result(function (event, data, formatted) {
                $("#DeliveryLocation").focus();
            });
            //收货地址
            $("#DeliveryLocation").autocomplete("/TransportOrder/FindAddress", {
                width: 260,
                selectFirst: true,
                formatItem: function (data, i, total) {
                    return "<I>" + data[0] + "</I>";
                },
                formatMatch: function (data, i, total) {
                    return data[0];
                },
                formatResult: function (data) {
                    return data[0]
                }
            }).result(function (event, data, formatted) {
                $("#Commisionedor_Name").focus();
            });
            //代码块3,托运人
            $("#Commisionedor_Name").autocomplete("/TransportOrder/FindClient", {
                width: 260,
                selectFirst: true,
                formatItem: function (data, i, total) {
                    var arr = String(data).split(",");
                    return "<I>" + arr[0] + "</I>";
                },
                formatMatch: function (data, i, total) {
                    return data[0];
                },
                formatResult: function (data) {
                    var arr = String(data).split(",");
                    return arr[0];
                }
            }).result(function (event, data, formatted) {
                var arr = String(data).split(",");
                $("#Commisionedor_Telephone").val(arr[1]);
                $("#SendMan_Address").val(arr[2]);
                $("#SendMan_PostNumber").val(arr[3]);
                $("#SendMan_Email").val(arr[4]);
                $("#txtSendManID").val(arr[5]);
                $("#Receiver_Name").focus();
            });

            //代码块4,收货人
            $("#Receiver_Name").autocomplete("/TransportOrder/FindClient", {
                width: 260,
                selectFirst: true,
                formatItem: function (data, i, total) {
                    var arr = String(data).split(",");
                    return "<I>" + arr[0] + "</I>";
                },
                formatMatch: function (data, i, total) {
                    return data[0];
                },
                formatResult: function (data) {
                    var arr = String(data).split(",");
                    return arr[0];
                }
            }).result(function (event, data, formatted) {
                var arr = String(data).split(",");
                $("#Receiver_Telephone").val(arr[1]);
                $("#Receiver_Address").val(arr[2]);
                $("#Receiver_PostNumber").val(arr[3]);
                $("#Receiver_Email").val(arr[4]);
                $("#txtBillManID").val(arr[5]);
                $("#txtGoodsName").focus();
            });

            $.formValidator.initConfig({ formID: "fromInfo", autoTip: true, tidyMode: true, onError: function (msg) { alert(msg) } });
            $("#txtOutStation").formValidator({ onShow: "请输入发站", onFocus: "发站不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "发站不能为空,请确认" });
            $("#txtArriveStation").formValidator({ onShow: "请输入到站", onFocus: "到站不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "到站不能为空,请确认" });
            $("#sltProvince").formValidator({ onShow: "请选择省市/自治区", onFocus: "省市/自治区不能为空", onCorrect: "选择合法" }).inputValidator({ min: 1, onError: "省市/自治区不能为空,请确认" });
            $("#txtStartStationLocation").formValidator({ onShow: "请输入发货地点", onFocus: "发货地点不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "发货地点不能为空,请确认" });
            $("#txtArriveStationLocation").formValidator({ onShow: "请输入到货地点", onFocus: "到货地点不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "到货地点不能为空,请确认" });
            $("#txtBillManName").formValidator({ onShow: "请输入托运人姓名", onFocus: "托运人姓名不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "托运人姓名不能为空,请确认" });
            $("#txtBillManTel").formValidator({ onShow: "请输入托运人电话", onFocus: "托运人电话不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "托运人电话不能为空,请确认" });
            $("#txtBillManAddress").formValidator({ onShow: "请输入托运人地址", onFocus: "托运人地址不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "托运人地址不能为空,请确认" });
            $("#txtBillManPostNumber").formValidator({ onShow: "请输入托运人邮编", onFocus: "托运人邮编不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "托运人邮编不能为空,请确认" });
            $("#txtBillManEmail").formValidator({ onShow: "请输入托运人E-Mail", onFocus: "托运人E-Mail不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "托运人E-Mail不能为空,请确认" });

            $("#txtReceiveManName").formValidator({ onShow: "请输入收货人姓名", onFocus: "收货人姓名不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "收货人姓名不能为空,请确认" });
            $("#txtReceiveManTel").formValidator({ onShow: "请输入收货人电话", onFocus: "收货人电话不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "收货人电话不能为空,请确认" });
            $("#txtReceiveManddress").formValidator({ onShow: "请输入收货人地址", onFocus: "收货人地址不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "收货人地址不能为空,请确认" });
            $("#txtReceiveManPostNumber").formValidator({ onShow: "请输入收货人邮编", onFocus: "收货人邮编不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "收货人邮编不能为空,请确认" });
            $("#txtReceiveManEmail").formValidator({ onShow: "请输入收货人E-Mail", onFocus: "收货人E-Mail不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "收货人E-Mail不能为空,请确认" });

            $("#txtGoodsName").formValidator({ onShow: "请输入货物品名 ", onFocus: "货物品名不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "货物品名不能为空,请确认" });
            $("#txtContainerType").formValidator({ onShow: "请输入集装箱箱型", onFocus: "集装箱箱型不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "集装箱箱型不能为空,请确认" });
            $("#txtContainerBoxType").formValidator({ onShow: "请输入集装箱箱类", onFocus: "集装箱箱类不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "集装箱箱类不能为空,请确认" });
            $("#txtContainerNum").formValidator({ onShow: "请输入集装箱数量", onFocus: " 集装箱数量不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: " 集装箱数量不能为空,请确认" });
            $("#txtContainerNo").formValidator({ onShow: "请输入集装箱号码", onFocus: "集装箱号码不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "集装箱号码不能为空,请确认" });
            $("#txtCloseCode").formValidator({ onShow: "请输入施封号码", onFocus: "施封号码不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "施封号码不能为空,请确认" });
            $("#txtFee").formValidator({ onShow: "请输入运输费用", onFocus: "运输费用不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "运输费用不能为空,请确认" });
            $("#txtGoodsPrice").formValidator({ onShow: "请输入货物价格", onFocus: "货物价格不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "货物价格不能为空,请确认" });
        });

        var rowIndex = 0;
        //加行
        function AddCargoRow() {
            rowIndex++;
            var rowHtml = "<tr  class='argData'><td><input id='txtGoodsName" + rowIndex + "' type='text' /></td><td><input id='txtContainerType" + rowIndex + "' type='text' /></td><td><input id='txtContainerBoxType" + rowIndex + "' type='text' /></td><td><input id='txtContainerNum" + rowIndex + "' type='text' /></td><td><input id='txtContainerNo" + rowIndex + "' type='text' /></td><td><input id='txtCloseCode" + rowIndex + "' type='text' /></td><td><input id='txtFee" + rowIndex + "' type='text' /><input type='button' style='width:10px;' value='-' onclick='DeleteCargoRow(this)' /></td></tr>";
            $("#waybillLastRow").before(rowHtml);
            AddValidationEffect();
        }

        function AddValidationEffect() {
            $("#txtGoodsName" + rowIndex).formValidator({ onShow: "请输入货物品名 ", onFocus: "货物品名不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "货物品名不能为空,请确认" });
            $("#txtContainerType" + rowIndex).formValidator({ onShow: "请输入集装箱箱型", onFocus: "集装箱箱型不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "集装箱箱型不能为空,请确认" });
            $("#txtContainerBoxType" + rowIndex).formValidator({ onShow: "请输入集装箱箱类", onFocus: "集装箱箱类不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "集装箱箱类不能为空,请确认" });
            $("#txtContainerNum" + rowIndex).formValidator({ onShow: "请输入集装箱数量", onFocus: " 集装箱数量不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: " 集装箱数量不能为空,请确认" });
            $("#txtContainerNo" + rowIndex).formValidator({ onShow: "请输入集装箱号码", onFocus: "集装箱号码不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "集装箱号码不能为空,请确认" });
            $("#txtCloseCode" + rowIndex).formValidator({ onShow: "请输入施封号码", onFocus: "施封号码不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "施封号码不能为空,请确认" });
            $("#txtFee" + rowIndex).formValidator({ onShow: "请输入运输费用", onFocus: "运输费用不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "运输费用不能为空,请确认" });
            $("#txtGoodsPrice" + rowIndex).formValidator({ onShow: "请输入货物价格", onFocus: "货物价格不能为空", onCorrect: "输入合法" }).inputValidator({ min: 1, onError: "货物价格不能为空,请确认" });
        }

        //删除行
        function DeleteCargoRow(ctl) {
            $(ctl).parent().parent().remove();
        }

        //用js提交表单（form）
        function SubmitPage() {
            CollectCargoData();
            $("#fromInfo").submit();
        }

        //收集页面上货物的数据
        function CollectCargoData() {
            var cargoRowCount = $(".argData").length; //货物的总行数
            var data = new Array(rowIndex);
            for (var i = 0; i < cargoRowCount; i++) {
                data[i] = new Array(7);
                data[i][0] = $("#txtGoodsName" + i).val();
                data[i][1] = $("#txtContainerType" + i).val();
                data[i][2] = $("#txtContainerBoxType" + i).val();
                data[i][3] = $("#txtContainerNum" + i).val();
                data[i][4] = $("#txtContainerNo" + i).val();
                data[i][5] = $("#txtCloseCode" + i).val();
                data[i][6] = $("#txtFee" + i).val();
            }
            $("#txtCargoData").val(data);
        }
    </script>
</head>
<body>
    <div>
        <div style="background-image: url(../../Content/Images/m_17.gif); background-repeat: no-repeat;
            width: 120px; height: 24px;">
            <div style="padding-top: 5px; padding-left: 5px; font-size: 14px;">
                >>新建运单
            </div>
        </div>
        <div style="background-image: url(../../Content/Images/m_26.gif); background-repeat: repeat-x;
            width: 100%; height: 6px;">
        </div>
        <div style="margin-left: 10px; padding-top: 10px;">
            <form id="fromInfo" method="post">
            <table id="tabInfo" class="formatedtable" cellspacing="1" cellpadding="1" border="1">
                <tr>
                    <td colspan="7" align="center" style="font-size: 24px;">
                        货物运单
                    </td>
                </tr>
                <tr>
                    <td>
                        发站所属省（市）自治区
                    </td>
                    <td colspan="2">
                        @Html.DropDownList("ddlStartSatationProvince", new SelectList(ViewBag.ProvinceList, "ID", "Name"), new { onchange = "SetStartSatationProvince()", style = "width:139px;" })
                    </td>
                    <td>
                        发站
                    </td>
                    <td colspan="3">
                        @Html.TextBoxFor(model => model.StartStation.Name)
                        <input id="txtStartSatationNameID" name="txtStartSatationNameID" class="needID" />
                    </td>
                </tr>
                <tr>
                    <td>
                        到站所属省（市）自治区
                    </td>
                    <td colspan="2">
                        @Html.DropDownList("ddlDestionationProvince", new SelectList(ViewBag.ProvinceList, "ID", "Name"), new { onchange = "SetProvince()", style = "width:139px;" })
                    </td>
                    <td>
                        到站
                    </td>
                    <td colspan="3">
                        @Html.TextBoxFor(model => model.DestionationStation.Name)
                        <input id="txtDestionationNameID" name="txtDestionationNameID" class="needID" />
                    </td>
                </tr>
                <tr>
                    <td>
                        发货地点
                    </td>
                    <td colspan="2">
                        @Html.TextBoxFor(model => model.StartStationLocation)
                    </td>
                    <td>
                        交货地点
                    </td>
                    <td colspan="3">
                        @Html.TextBoxFor(model => model.DeliveryLocation)
                    </td>
                </tr>
                <tr>
                    <td rowspan="3">
                        托运人
                    </td>
                </tr>
                <tr>
                    <td>
                        名称
                    </td>
                    <td colspan="3">
                        @Html.TextBoxFor(model => model.Commisionedor.Name)
                        <input id="txtSendManID" name="txtSendManID" type="text" class="needID" />
                    </td>
                    <td>
                        电话
                    </td>
                    <td>
                        @Html.TextBoxFor(model => model.Commisionedor.Telephone)
                    </td>
                </tr>
                <tr>
                    <td>
                        地址
                    </td>
                    <td>
                        @Html.TextBoxFor(model => model.Commisionedor.Address)
                    </td>
                    <td>
                        邮编
                    </td>
                    <td>
                        @Html.TextBoxFor(model => model.Commisionedor.PostNumber)
                    </td>
                    <td>
                        E-mail
                    </td>
                    <td>
                        @Html.TextBoxFor(model => model.Commisionedor.Email)
                    </td>
                </tr>
                <tr>
                    <td rowspan="3">
                        收货人
                    </td>
                </tr>
                <tr>
                    <td>
                        名称
                    </td>
                    <td colspan="3">
                        @Html.TextBoxFor(model => model.Receiver.Name)
                        <input id="txtBillManID" name="txtBillManID" type="text" class="needID" />
                    </td>
                    <td>
                        电话
                    </td>
                    <td>
                        @Html.TextBoxFor(model => model.Receiver.Telephone)
                    </td>
                </tr>
                <tr>
                    <td>
                        地址
                    </td>
                    <td>
                        @Html.TextBoxFor(model => model.Receiver.Address)
                    </td>
                    <td>
                        邮编
                    </td>
                    <td>
                        @Html.TextBoxFor(model => model.Receiver.PostNumber)
                    </td>
                    <td>
                        E-mail
                    </td>
                    <td>
                        @Html.TextBoxFor(model => model.Receiver.Email)
                    </td>
                </tr>
                <tr>
                    <td>
                        货物品名
                    </td>
                    <td>
                        集装箱箱型
                    </td>
                    <td>
                        集装箱箱类
                    </td>
                    <td>
                        集装箱数量
                    </td>
                    <td>
                        集装箱号码
                    </td>
                    <td>
                        施封号码
                    </td>
                    <td>
                        运输费用
                    </td>
                </tr>
                <tr class="argData">
                    <td>
                        <input id="txtGoodsName0" type="text" />
                    </td>
                    <td>
                        <input id="txtContainerType0" type="text" />
                    </td>
                    <td>
                        <input id="txtContainerBoxType0" type="text" />
                    </td>
                    <td>
                        <input id="txtContainerNum0" type="text" />
                    </td>
                    <td>
                        <input id="txtContainerNo0" type="text" />
                    </td>
                    <td>
                        <input id="txtCloseCode0" type="text" />
                    </td>
                    <td>
                        <input id="txtFee0" type="text" /><input id="btnAddGoods" type="button" value="+"  style='width:10px;' accesskey="W" onclick="AddCargoRow()" />
                    </td>
                </tr>
                <tr id="waybillLastRow">
                    <td colspan="2">
                        托运人记载事项：<br />
                        @Html.TextAreaFor(model => model.CommissionedorRemark)
                    </td>
                    <td colspan="2">
                        添附文件：<br />@Html.TextAreaFor(model => model.AttachedFile)
                    </td>
                    <td colspan="2">
                        货物价格：<br />@Html.TextAreaFor(model => model.Price)
                    </td>
                    <td colspan="2">
                        承运人记载事项：<br />@Html.TextAreaFor(model => model.TransportorRemark)
                    </td>
                </tr>
            </table>
            <br />
            <input id="txtCargoData" name="txtCargoData" />
            <input class="btn3" type="button" value="保存" onclick="SubmitPage()" />
            </form>
        </div>
    </div>
</body>
</html>
